// Name:            Table
// Description:     Defines styles for tables
//
// Component:       `uk-table`
//
// Modifiers:       `uk-table-middle`
//                  `uk-table-striped`
//                  `uk-table-condensed`
//                  `uk-table-hover`
//
// ========================================================================


// Variables
// ========================================================================

@table-margin-vertical: 15px;
@table-padding-vertical: 8px;
@table-padding-horizontal: 8px;

@table-caption-color: #999;
@table-caption-font-size: 12px;

@table-striped-background: #f5f5f5;

@table-condensed-padding-vertical: 4px;
@table-condensed-padding-horizontal: 8px;

@table-hover-background: #EEE;


/* ========================================================================
   Component: Table
 ========================================================================== */

/*
 * 1. Remove most spacing between table cells.
 * 2. Block element behavior
 * 3. Style
 */

.uk-table {
  /* 1 */
  border-collapse: collapse;
  border-spacing: 0;
  /* 2 */
  width: 100%;
  /* 3 */
  margin-bottom: @table-margin-vertical;
}

/*
 * Add margin if adjacent element
 */

* + .uk-table {
  margin-top: @table-margin-vertical;
}

.uk-table th,
.uk-table td {
  padding: @table-padding-vertical @table-padding-horizontal;
  .hook-table;
}

/*
 * Set alignment
 */

.uk-table th {
  text-align: left;
}

.uk-table td {
  vertical-align: top;
}

.uk-table thead th {
  vertical-align: bottom;
}

/*
 * Caption and footer
 */

.uk-table caption,
.uk-table tfoot {
  font-size: @table-caption-font-size;
  font-style: italic;
}

.uk-table caption {
  text-align: left;
  color: @table-caption-color;
}


/* Sub-modifier: `uk-table-middle`
 ========================================================================== */

.uk-table-middle,
.uk-table-middle td {
  vertical-align: middle !important;
}


/* Modifier: `uk-table-striped`
 ========================================================================== */

.uk-table-striped tbody tr:nth-of-type(odd) {
  background: @table-striped-background;
}


/* Modifier: `uk-table-condensed`
 ========================================================================== */

.uk-table-condensed td {
  padding: @table-condensed-padding-vertical @table-condensed-padding-horizontal;
}


/* Modifier: `uk-table-hover`
 ========================================================================== */

.uk-table-hover tbody tr:hover {
  background: @table-hover-background;
}


// Hooks
// ========================================================================

.hook-table-misc;

.hook-table() {
}

.hook-table-misc() {
}